<extend name="Index/index"/>
<block name="main">
		<title>个人资料</title>

		<link href="__PUBLIC__/static/css/personal.css" rel="stylesheet" type="text/css">
		<link href="__PUBLIC__/static/css/infstyle.css" rel="stylesheet" type="text/css">
		<script src="__PUBLIC__/static/AmazeUI-2.4.2/assets/js/jquery.min.js" type="text/javascript"></script>
		<script src="__PUBLIC__/static/AmazeUI-2.4.2/assets/js/amazeui.js" type="text/javascript"></script>
			
	</head>

	<body>
		<!--头 -->
		<include file="Public/top" />
            <include file="Public/daohang" />
			<b class="line"></b>
		<div class="center">
			<div class="col-main">
				<div class="main-wrap">

					<div class="user-info">
						<!--标题 -->
						<div class="am-cf am-padding">
							<div class="am-fl am-cf"><strong class="am-text-danger am-text-lg">个人资料</strong> / <small>Personal&nbsp;information</small></div>
						</div>
						<hr/>

						<!--头像 -->
					<form class="am-form am-form-horizontal" action="<{:U('Account/edit')}>" method="post">
						<div class="user-infoPic">

							<!-- <div class="filePic"> -->
								<if condition="$iconname eq ''">
								
									<img class="am-circle am-img-thumbnail" src="__UPLOAD__/thumb/1.jpg"  width="100px" height="100px" alt="" />
								<elseif condition="$iconname neq ''"/>
									<img class="am-circle am-img-thumbnail" src="__UPLOAD__/thumb/100_<{$iconname}>"  width="100px" height="100px" alt="" />
								
								</if>
							<!-- </div> -->

							<p class="am-form-help">头像</p>

							<div class="info-m">
								<div><b>用户名：<i><{$nickname}></i></b></div>
								<div class="u-level">
									<span class="rank r2">
							             <s class="vip1"></s><a class="classes" href="#">铜牌会员</a>
						            </span>
								</div>
							</div>
						</div>

						<!--个人信息 -->
						<div class="info-main">

								<div class="am-form-group">
									<label for="user-name2" class="am-form-label">昵称</label>
									<div class="am-form-content">
										<input type="text" name="username" id="user-name2" value="<{$nickname}>">
										<p></p>
									</div>
								</div>

						

								<div class="am-form-group">
									<label class="am-form-label">性别</label>
									<div class="am-form-content sex">
										<label class="am-radio-inline">
											<input type="radio" name="sex" value="0" data-am-ucheck <if condition="$sex eq 0">checked</if>> 男
										</label>
										<label class="am-radio-inline">
											<input type="radio" name="sex" value="1" data-am-ucheck <if condition="$sex eq 1">checked</if>> 女
										</label>
										<label class="am-radio-inline">
											<input type="radio" name="sex" value="2" data-am-ucheck <if condition="$sex eq 2">checked</if>> 保密
										</label>
									</div>
								</div>

								<div class="am-form-group">
									<label for="user-birth" class="am-form-label">生日</label>
									<div class="am-form-content">
										<input id="user-birth" name="birthday"  type="date" >
										<p><{$birthday}></p>

									</div>										
								</div>
								<div class="am-form-group">
									<label for="user-phone" class="am-form-label">电话</label>
									<div class="am-form-content">
										<input id="user-phone" value="<{$phone}>" type="tel" readonly>

									</div>
								</div>
								<div class="am-form-group">
									<label for="user-email"  class="am-form-label">电子邮件</label>
									<div class="am-form-content">
										<input id="user-email" name="email" value="<{$email}>" type="email">
										<p></p>
									</div>
								</div>


								<div class="info-btn">
									<div class="am-btn am-btn-danger">
									<!-- <input class="am-btn am-btn-danger" type="button" value="保存修改"> -->
									<button class="am-btn am-btn-danger">保存修改</button>
									</div>
								</div>

						</div>
					</form>

					</div>

				</div>
			</div>

			<include file="Public/menu" />
		</div>
		<script type="text/javascript">
			// 入口文件这里不需要写
			// $(function(){

			// })
			// 表单验证
			var isUsername = false;
			var isEmail = false;


			// 昵称验证
			$('input[name=username]').blur(function(){
				var str = $(this).val();//获取用户的昵称
				
				var reg = /\w{6,16}/;

				// 正则验证是否合法
				var r = reg.test(str);
				//如果r验证合法，发送ajax请求，验证服务器数据库
				if (r) {
					$.post("<{:U('Account/reg')}>",{"username":str},function(data){
						if (data==0) {
							$('input[name=username]').next().html('ok').css('color','green');
							isUsername = true;
						}else{
							$('input[name=username]').next().html('用户已注册').css('color','red');
							isUsername = false;
						}
					});
				}else{
					$(this).next().html('用户名不合法').css('color','red');
				}
			});

		// 邮箱验证
		$('input[name=email]').blur(function(){
			var email = $(this).val();

			var reg = /\w+\@{1}\w+\.\w{2,4}/;
			var r = reg.test(email);

			if (r) {
				isEmail = true;
				$('input[name=email]').next().html('ok').css('color','green');
			}else{
				isEmail = false;
				$('input[name=email]').next().html('邮箱格式不合法').css('color','red');
			}
		});

		// 提交
		$('button').click(function(){
			if (isUsername && isEmail) {
				return true;
			};
			return false;
		});

		</script>
</block>
